@import '@snack-uikit/figma-tokens/build/scss/styles-theme-variables';

.inputPrivate {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;

  color: simple-var($sys-neutral-text-main);
  text-overflow: ellipsis;

  background-color: transparent;
  border: none;
  border-radius: 0;
  outline: 0;

  &::placeholder {
    color: simple-var($sys-neutral-text-disabled);
  }

  &:read-only {
    color: simple-var($sys-neutral-text-support);
  }

  &:placeholder-shown {
    text-overflow: ellipsis;
  }

  &[disabled] {
    color: simple-var($sys-neutral-text-disabled);
  }

  &[type=number] {
    -moz-appearance: textfield;

    &::-webkit-outer-spin-button,
    &::-webkit-inner-spin-button, {
      margin: 0;
      -webkit-appearance: none;
    }
  }
}
